<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title></title>
	<link rel="stylesheet" href="">
	<style type="text/css" media="screen">
		.box {
			background-color: gray;
  			border: solid 1px black;
  			overflow: hidden;
  			*zoom: 1;
		}
		.wrap {
			width: 100px;
			height: 100px;
			background: red;
			float: left;
		}
		p {
			float: right;
		}
	</style>
</head>
<body>
	<div class="box">
		<div class="wrap">
		</div>
		<p>111111111111111</p>
		<!-- 方法二：使用CSS的overflow属性

		给浮动元素的容器添加overflow:hidden;或overflow:auto;可以清除浮动，另外在 IE6 中还需要触发 hasLayout ，例如为父元素设置容器宽高或设置 zoom:1。

		在添加overflow属性后，浮动元素又回到了容器层，把容器高度撑起，达到了清理浮动的效果。
 -->
		<div class="clear">
			
		</div>
	</div>
</body>
</html>